<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			* {
				padding: 0;
				margin: 0;
			}

			img {
				vertical-align: bottom;
			}

			li {
				list-style: none;
			}

			a {
				text-decoration: none;
			}

			.fl {
				float: left;
			}

			.fr {
				float: right;
			}

			.clearfix::before,
			.clearfix::after {
				content: "";
				display: table;
			}

			.clearfix::after {
				clear: both
			}

			.bd {
				border: 1px solid red;
			}

			.header {
				width: 1190px;
				height: 110px;
				margin: 0 auto;
			}

			.xz {
				margin-top: 43px;
				margin-right: 40px;
			}

			.button {
				line-height: 34px;
				display: inline-block;
				width: 80px;
				height: 34px;
				margin: 38px 0 0 8px;
				cursor: pointer;
				text-align: center;
				color: #34495e;
				border: 1px solid #34495e;
				border-radius: 20px
			}

			.main {
				height: 520px;
				background: url(./img/logo.jpg) repeat center;
			}

			.content1 {
				height: 420px;
				width: 1190px;
				margin: 0 auto;
			}

			.bq {
				/* margin-top: 100px; */
				margin-right: 50px;
				text-align: center;
				font-size: 30px;
			}

			.bq2 {
				text-align: center;
				margin-top: 20px;
			}

			.bq3 {
				text-align: center;
				color: floralwhite;
				font-size: 18px;
			}

			.bj1 {
				width: 285.6px;
				font-family: "微软雅黑";
				font-size: 18px;
				text-align: center;
			}

			.wz {
				font-size: 30px;
				text-align: center;
			}

			.dd {
				background-color: #e5f2fe;
				padding: 30px 0px;
			}

			.content2 {
				height: 520px;
				width: 1190px;
				margin: 0 auto;
			}

			.dip {
				font-size: 18px;
				line-height: 1.6;
				float: left;
				box-sizing: border-box;
				width: 370px;
				height: 180px;
				margin: 10px 1%;
				color: #fff;
				border-radius: 5px;
				background: #299efd;
				background-repeat: no-repeat;
			}

			p {
				display: block;
				margin-block-start: 1em;
				margin-block-end: 1em;
				margin-inline-start: 0px;
				margin-inline-end: 0px;
			}

			.right {
				padding: 55px 0 0 190px;
			}

			.left {
				padding: 70px 220px 0 0;
			}

			.one {
				height: 380px;
				padding-top: 50px;
			}

			.ee {
				padding: 60px 0;
				text-align: center;
				color: #333;
			}

			.content3 {
				width: 1190px;
				margin: 0 auto;
				height: 480px;
			}

			.dips {
				height: 520px;
				width: 1190px;
			}

			.ff {
				height: 350px;
				text-align: center;
				color: #333;
				background-image: url(./img/school_information.jpg);
			}

			.shuzi {
				height: 350px;
				width: 330px;
			}

			.sz {
				height: 50px;
				font-size: 95px;
				color: #FFFAF0
			}

			.hz {
				text-align: center;
				font-size: 18px;
				color: #FFFAF0
			}

			.gg {
				height: 350px;
				/* font-family: "微软雅黑"; */
			}

			.hz1 {
				padding-top: 50px;
				font-size: 14px;
				line-height: 30px;
				width: 565px
			}

			.hz2 {
				padding-top: 50px;
				font-size: 14px;
				line-height: 30px;
				width: 400px
			}
		</style>
	</head>
	<body>
		<!-- header -->
		<div class="header">
			<div class="logo fl"><img src="./img/u_logo.jpg">
			</div>
			<div class="button fr"><a href="">注册</a></div>
			<div class="button fr"><a href="">登录</a></div>
			<div class="xz fr"><a href=""><img src="img/phone.png">&nbsp;&nbsp;APP下载</a></div>
		</div>
		<!-- main -->
		<div class="main "></div>
		<div class="content1">
			<p class="bq">一站式混合教学解决方案</p>
			<p class="bq2">为高等院校外语教学提供教、学、评、测、研一站式混合教学解决方案，全方位提升学习体验和教学效果。</p>
			<div class="bj">
				<div class="bj1 fl"><img src="img/tips_01.png">
					<p>多层次课程体系</p>
					<p>满足多元学习需求</p>
				</div>
				<div class="bj1 fl"><img src="img/tips_02.png">
					<p>全流程一站服务</p>
					<p>覆盖教学评测研</p>
				</div>
				<div class="bj1 fl"><img src="img/tips_03.png">
					<p>多终端无缝衔接</p>
					<p>融合不同教学场景</p>
				</div>
				<div class="bj1 fl"><img src="img/tips_04.png">
					<p>深层次数据挖掘</p>
					<p>全面支持智慧教学</p>
				</div>
			</div>
		</div>
		<div class="dd">
			<div class="content2">
				<p class="bq">随时随地 智慧学习</p>
				<div class="bj">
					<div class="bj1 fl"><img src="img/step_01.jpg" alt="">
						<p class="bq2">多元课程 个性选择</p>
					</div>
					<div class="bj1 fl"><img src="img/step_02.jpg" alt="">
						<p class="bq2">立体教程 交互学习</p>
					</div>
					<div class="bj1 fl"><img src="img/step_03.jpg" alt="">
						<p class="bq2">随时随地 即学即练</p>
					</div>
					<div class="bj1 fl"><img src="img/step_04.jpg" alt="">
						<p class="bq2">互动课堂 趣味高效</p>
					</div>
				</div>
			</div>
		</div>
		<div class="ee">
			<div class="content3">
				<p class="bq">智慧教学 无处不在</p>
				<div class="dips">
					<div class="dip one" style="background-image: url(img/dips_01.png);">
						<p>海量资源 轻松备课</p>
					</div>
					<div class="dip left" style="background-image: url(img/dips_02.png);">
						<p>智慧平台<br>
							设计教学</p>
					</div>
					<div class="dip left" style="background-image: url(img/dips_03.png);">
						<p>手机互动<br>激活课堂</p>
					</div>
					<div class="dip right" style="background-image: url(img/dips_04.png);">
						<p>过程监控<br>多位评价</p>
					</div>
					<div class="dip right" style="background-image: url(img/dips_05.png);">
						<p>学习分析<br>反拨教学</p>
					</div>
				</div>
			</div>
		</div>
		<div class="ff">
			<div class="content3">
				<div class="shuzi fl">
					<p class="sz">1400+</p>
					<p class="hz">使用院校</p>
				</div>
				<div class="shuizi fl">
					<p class="sz">40,000+</p>
					<p class="hz">教师用户</p>
				</div>
				<div class="suhizi fl">
					<p class="sz">5,000,000</p>
					<p class="hz">学生用户</p>
				</div>
			</div>
		</div>
		<div class="gg">
			<div class="content3">
				<div class="hz1 fl">
					<p>U校园是外研社Unipus旗下的在线学习平台，为高等院校外语教学提供混合式教学解决方
						<br>案。学、练、测、评一站式交互体验，学习内容生动有趣，教学工具科学有效，趣味学习
						<br>智慧教学，外语教与学更精彩。Unipus，有你更精彩！</p>
					<br>
					<p>Copyright © 2020 Unipus.cn, 版权所有
						<br><img src="img/nine_leftpiv%20(1).png" alt=""><a href="">京公网安备：11010802020838号&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
							京ICP备18030989号-2</a></p>
				</div>
				<div class="hz2 fr">
					<p><img src="./img/mess.jpg" alt="">关注小U，每日坐收专业有趣的外语知识</p>
					<p><img src="./img/mess.jpg" alt="">关注Unipus教师发展，获取权威专业的教研秘笈！</p>
					<p><img src="./img/mess.jpg" alt="">客服邮箱： service@unipus.cn</p>
					<p><img src="./img/mess.jpg" alt="">客户服务： <a href="">在线咨询</a></p>
				</div>
			</div>
		</div>
	</body>
</html>
